import React from "react";
import {View, Dimensions, Image, StyleSheet, Text, ScrollView, Clipboard } from "react-native";
import BasePage from "./BasePage";
import TitleDetailView from "./TitleDetailView";
import PlatformTouchable from "react-native-platform-touchable";


const WIN_WIDTH = Dimensions.get("window").width;

//
class NetworkRecordDetailPage extends BasePage {

  //隐藏navigationBar
  static navigationOptions = ({ navigation, navigationOptions }) => {
    return {
      title: "详情",
      headerRight:<View />
    };
  };

  constructor(props){
    super(props);
    this.state = {item: props.navigation.getParam('item'), numberOfLines: 2};
  }


  showPage(name, params=null) {
    this.props.navigation.push(name, params);
  }

  renderContent() {
    const config = this.state.item.config;

    let data = config.data;
    if (data && data.length > 0 && data.indexOf('&') !== -1) {
      const params = data.split('&');
      data = params.join('\n');
    }

    const url = config.url;
    return (<View
      style={{flex: 1, alignItems: "stretch", width: WIN_WIDTH, backgroundColor: 'white'}}
    >
      <ScrollView contentContainerStyle={{alignItems: 'stretch'}}>
        <TitleDetailView title={'时间'} titleStyle={{fontWeight:'bold'}} detail={this.state.item.date} titleWidth={60}/>
        <TitleDetailView title={'接口'} titleStyle={{fontWeight:'bold'}} detail={url?url.replace(config.baseURL,''):''} titleWidth={60}/>
        <PlatformTouchable onPress={()=>this.setState({numberOfLines: this.state.numberOfLines === 2 ? 0 : 2})}>
          <TitleDetailView title={'参数'} titleStyle={{fontWeight:'bold'}} detail={JSON.stringify(config.params) || ''} detailProps={{numberOfLines:this.state.numberOfLines}} titleWidth={60}/>
        </PlatformTouchable>
        <TitleDetailView title={'数据'} titleStyle={{fontWeight:'bold'}} detail={data || ''} titleWidth={60}/>
        <PlatformTouchable onPress={()=>{
          Clipboard.setString(this.state.item.data);
        }}>
          <TitleDetailView title={'返回'} titleStyle={{fontWeight:'bold'}} detail={JSON.stringify(this.state.item.data, null, 2) || ''} titleWidth={60}/>
        </PlatformTouchable>
        <TitleDetailView title={'错误'} titleStyle={{fontWeight:'bold'}} detail={this.state.item.error? this.state.item.error.message :''} titleWidth={60}/>
      </ScrollView>
    </View>)
      ;
  }
}
const styles = StyleSheet.create({

});
export default NetworkRecordDetailPage;
